<template>
	<view class="details">
		<view class="ul">
			<view><image :src="initData.image" mode="widthFix" class="img" /></view>
			<view>
				<text class="text">订单号：</text>
				{{ initData.orderSn }}
			</view>
			<view>
				<text class="text">商品货号：</text>
				{{ initData.goodsSn }}
			</view>
			<view>
				<text class="text">供应商信息：</text>
				{{ initData.supplierName }}
			</view>
			<view>
				<text class="text">数量：</text>
				1件
			</view>
			<view>
				<text class="text">客户名称：</text>
				{{ initData.contactUser }}
			</view>
			<view>
				<text class="text">联系电话：</text>
				{{ initData.contactPhone }}
			</view>
			<view v-for="item in initData.sku" :key="item.value">
				<text class="text">{{ item }}</text>
			</view>
			<view>
				<text class="text">收货地址：</text>
				{{ initData.addrDetail }}
			</view>
			<view>
				<text class="text">客服名称：</text>
				{{ initData.expressSn }}
			</view>
			<view>
				<text class="text">审核人：</text>
				{{ initData.expressSn }}
			</view>
			<view>
				<text class="text">审核时间：</text>
				{{ initData.expressSn }}
			</view>
			<view>
				<text class="text">备注：</text>
				{{ initData.expressSn }}
			</view>
			<view  v-if="!initData.shipTime">
				<text class="text">客服备注：</text>
				{{ initData.shipTime }}
			</view>
			<view>
				<text class="text">退回原因：</text>
				{{ initData.remark }}
			</view>
			<view>
				<text class="text">退还备注：</text>
				{{ initData.remark }}
			</view>
			<view><text class="text">处理结果：</text></view>
			<view><text class="text">处理时间 ：</text></view>
			<view v-if="initData.auditResult.value == 10"><text class="text">驳回原因：</text></view>
		</view>
		<view class="go-top" v-show="is_go_top" @click="backTop"><image src="/static/img/go_top.png" /></view>
	</view>
</template>

<script>
import { uniIcons } from '@dcloudio/uni-ui';
export default {
	components: { uniIcons },
	data() {
		return {
			initData: {},
			id: '',
			array: ['中国', '美国', '巴西', '日本'],
			index: 0,
			is_go_top: false
		};
	},
	onPageScroll: function(e) {
		//nvue暂不支持滚动监听，可用bindingx代替
		if (e.scrollTop > 200) {
			this.is_go_top = true;
		} else {
			this.is_go_top = false;
		}
	},
	mounted() {
		uni.showLoading({
			title: '数据加载中'
		});
		var obj = new Object();
		obj.pageSize = 10;
		entrepot
			.initData(obj)
			.then(res => {
				this.paging.total = Math.ceil(res.data.total / res.data.size);
				this.paging.page = res.data.current;
				this.dataList = res.data.records.map(v => {
					v.image = this.imgCDNUrl + v.productImg;
					var sku = [];
					if (v.productSkuDesp) {
						sku = v.productSkuDesp.split(',');
					}
					v.sku = sku;
					return v;
				});
				uni.hideLoading();
			})
			.catch(err => {
				console.log(new Error('请检查网络后重试'));
			});
	},
	methods: {
		// 计算距离顶部的高度，均分10等分，
		backTop() {
			uni.pageScrollTo({
				scrollTop: 0,
				duration: 200
			});
		}
	}
};
</script>
<style lang="less" scoped>
page {
	background: #ffffff;
}
.details {
	.img {
		width: 100%;
		border: 1px solid #efeff4;
	}
	.ul {
		line-height: 72rpx;
		font-size: 24rpx;
		color: #999999;
		padding: 20rpx;
		.text {
			display: inline-block;
			width: 180rpx;
			text-align-last: justify;
			color: #333;
		}
	}
}
.msg {
	padding: 20rpx;
	border-top: 26rpx solid #f6f6f6;
	.li {
		position: relative;
		display: flex;
		flex-direction: row;
		line-height: 120rpx;
		font-size: 26rpx;
		text {
			font-size: 28rpx;
			width: 180rpx;
			text-align-last: justify;
		}
		.remark {
			display: inline-block;
			width: 520rpx;
			word-wrap: break-word;
			line-height: 50rpx;
		}
	}
	.button {
		margin-top: 50rpx;
		display: flex;
		flex-direction: row;
		view {
			width: 208rpx;
			line-height: 74rpx;
			border-radius: 37rpx;
			text-align: center;
			font-size: 28rpx;
			margin-right: 45rpx;
		}
		.accept {
			color: #fff;
			background: linear-gradient(80deg, #d2158a, #fc6395);
		}
		.reject {
			color: #bd3c8c;
			border: 1px solid #bd3c8c;
		}
		.rejects {
			margin-right: 0;
			color: #666666;
			border: 1px solid #e1e1e1;
		}
	}
}
.popup {
	width: 612rpx;
	padding: 20rpx;
	background: #ffffff;
	border-radius: 20rpx;

	.title {
		text-align: center;
		font-size: 30rpx;
		line-height: 60rpx;
	}
	.p {
		font-size: 28rpx;
	}
	textarea {
		width: 100%;
		height: 258rpx;
		padding: 20rpx;
		margin-top: 25rpx;
		border: 1px solid #efefef;
		box-sizing: border-box;
	}
	.button {
		margin-top: 50rpx;
		padding: 0 50rpx;
		display: flex;
		flex-direction: row;
		text-align: center;
		view {
			width: 208rpx;
			line-height: 74rpx;
			border-radius: 37rpx;
			font-size: 28rpx;
			margin: 0 32.5rpx;
		}
		.accept {
			color: #fff;
			background: linear-gradient(80deg, #d2158a, #fc6395);
		}
		.reject {
			color: #bd3c8c;
			border: 1px solid #bd3c8c;
		}
	}
}
</style>
